<template>
  <Global>
    <div class="shelf">
      <ShelfUserInfo
        :num="shelfList.length > 0 ? shelfList.length - 1 : 0"
        :user-info="userInfo"
        :read-day="readDay"
      />
      <ShelfList :shelf-list="shelfList" />
    </div>
  </Global>
</template>

<script>
import Global from "@/components/Global";
import ShelfUserInfo from "@/components/shelf/ShelfUserInfo";
import ShelfList from "@/components/shelf/ShelfList";
import { getShelf, day } from "@/api";
import { handleError } from "@/utils";
import { getStorageSync } from "@/api/wechat";

export default {
  data() {
    return {
      userInfo: {},
      shelfList: [],
      readDay: 1,
    };
  },
  components: {
    Global,
    ShelfUserInfo,
    ShelfList,
  },
  mounted() {
    this.userInfo = getStorageSync("userInfo");
    console.log("shelf", this.userInfo);
    const openId = getStorageSync("openId");
    if (openId) {
      getShelf(openId).then((response) => {
        if (handleError(response)) {
          this.shelfList = response.data.data;
          this.shelfList.push({});
        }
      });
      day(openId).then((response) => {
        if (handleError(response)) {
          this.readDay = response.data.data.day;
        }
      });
    }
  },
};
</script>